﻿<div>
    <div id="flex-demo">
        <p>sub-element Align left</p>
        <Row Justify="start">
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
        </Row>
        <p>sub-element Align center</p>
        <Row Justify="center">
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
        </Row>
        <p>sub-element Align right</p>
        <Row Justify="end">
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
        </Row>
        <p>sub-element monospaced arrangement</p>
        <Row Justify="space-between">
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
        </Row>
        <p>sub-element Align full</p>
        <Row Justify="space-around">
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
            <Col Span="4">col-4</Col>
        </Row>
    </div>

        <style>
            #flex-demo .ant-row {
                background-color: rgba(128, 128, 128, 0.08);
            }
        </style>

</div>
@code{

}